<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="core" %>
<%@ taglib prefix="fmt" uri="fmt" %>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html>
<html>
<head>
<title>气泡讨论板块</title>
		<link rel="stylesheet" type="text/css" href="<%=path%>/page/front/disc/css/normalize.css" />
		<link rel="stylesheet" type="text/css" href="<%=path%>/page/front/disc/css/icons.css" />
		<link rel="stylesheet" type="text/css" href="<%=path%>/page/front/disc/css/style1.css" />
		<link rel="stylesheet" type="text/css" href="<%=path%>/page/front/disc/css/style2.css" />
		<script src="../../page/front/disc/js/modernizr.custom.js"></script>
		
        <link href="http://netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet">
		<!-- Loading Bootstrap1 -->
    	<link rel="stylesheet" type="text/css" href="<%=path%>/page/front/disc/css/bootstrap.css" />
		<link rel="stylesheet" type="text/css" href="<%=path%>/page/front/disc/bianji/style.css">
        <link rel="stylesheet" type="text/css" href="<%=path%>/page/front/disc/bianji/src/js/jquery.notebook.css">
        <link rel="stylesheet" type="text/css" href="<%=path%>/page/front/disc/bianji/css/default.css" />
        <link rel="stylesheet" type="text/css" href="<%=path%>/page/front/disc/bianji/css/component.css" />
        <script src="<%=path%>/page/front/disc/bianji/js/modernizr.custom.js"></script>
		<style type="text/css">
            
            #submit{
            	width:95%;
            	margin:0 auto;
            	height:50px;
            	margin-top:20px;
            }
            #select{
            	margin-top:10px;
            	float:right;
            }
            #edit{
            	width:100%;
            }
            #use{
            	width:100%;
            }
            div{ word-wrap: break-word; word-break: normal;}
            #usertu{
            	position: absolute;
				z-index: 12;
				bottom: -100px;
				right: -120px;
				width: 150px;
				height: 150px;
            }
            #img1{
            	-webkit-border-radius:150px;
              	-moz-border-radius:150px;
              	border-radius:150px;
            }
            .taolunban{
            	width:100%;
            }
             .tupian{
            	width:100px;
            	height:110px;
            	margin-top:-15px;
            	margin-right:-15px;
             	position:absolute;
             	right:-100px;
            	z-index:22;
            }
            .tupian1{
            	width:100px;
            	height:110px;
            	margin-top:-15px;
            	margin-left:-15px;
             	position:absolute;
             	left:-106px;
            	z-index:22;            
            }
            .tu{
            	width:71px;
            	height:71px;
            	margin:0 auto;
            }
            .tu a{
            	background:none;
            	border:0px;
            }
            .neirong{
            	width:100px;
            	height:40px;
            	text-align:center;
            	font-size:14px;
            	color:#fff;
            	line-height:13px;
            }
            .img{
            	-webkit-border-radius:71px;
              	-moz-border-radius:71px;
              	border-radius:71px;
            }
            .img:hover{
            	margin-top:-2px;
            	margin-left:-2px;
            	width:74px;
            	height:74px;
            	-webkit-border-radius:74px;
              	-moz-border-radius:74px;
              	border-radius:74px;
            }
            #top{
            	width:100px;
            	height:50px;
            	margin:10px auto;
            }
            #top a{
            	color:#fff;
            	border:0px;
            }
            #top a:hover{
            	color:#c55500;
            	background:none;
            	border:1px;
            }
            #xixi{
            	position: absolute;
				z-index: 12;
				margin-top:100px;
				bottom: -100px;
				right: 50px;
				width: 100px;
				height: 60px;
				text-align:center;
				color:#fff;
            }
            .zan{
            	width:30px;
            	height:40px;
            	margin-top:40px;
            	margin-left:-14px;
             	position:absolute;
            	z-index:32; 
            	color:#c55500;
				font-size:12px;
				text-align:center;
            }
            .zan1{
            	width:30px;
            	height:40px;
            	margin-top:40px;
            	margin-left:90px;
             	position:absolute;
            	z-index:32; 
            	color:#c55500;
				font-size:12px;
				text-align:center;
            }
        </style>
</head>



<body>
	<div class="container">
		<div class="top">
			<blockquote class="oval-thought-border">
				<div id="xixi">${one.users.uName}<br/><fmt:formatDate value="${one.drTime}" pattern="yy-MM-dd HH:mm:ss" /></div>
				<p>${one.drContent}</p>
				<div id="usertu">
					<c:if test="${one.users.image.imLoclhost!=null}">
					<img id="img1" height="150" alt="" width="150" src="<%=path%>/page/upload/images/${one.users.image.imLoclhost}"/>
					</c:if>
					<c:if test="${one.users.image.imLoclhost==null}">
					<img id="img1" height="150" alt="" width="150" src="<%=path%>/page/upload/images/123456.jpg"/>
					</c:if>
				</div>
			</blockquote>
		</div>
				<input type="hidden" id="drid" value="${one.drId}"/><br/>
				<c:if test="${pageif==1}">
				<div id="top"><a href="../${one.drId}/see.html?p=${page+10}">查看更多</a></div>
				</c:if>
		<div class="content">
			
			<c:forEach items="${one.discuss}" var="all">
				<div class="taolunban">
					<c:if test="${usid != all.usersUId}">
						<div class="triangle-right left">
							<div class="tupian1"><div class="zan1">关注<br/><span id="dianzan${all.dsId}">${all.suport}</span></div>
								<div class="tu">
									<a href="javascript:function()" onclick="dianzan('${all.dsId}')">
										<c:if test="${all.users.image.imLoclhost!=null}">
										<img class="img" id="img${all.dsId}" height="71"  title="<c:if test="${all.sc==0}">关注</c:if><c:if test="${all.sc==1}">取消关注</c:if>" width="71" src="<%=path%>/page/upload/images/${all.users.image.imLoclhost}"/>
										</c:if>
										<c:if test="${all.users.image.imLoclhost==null}">
										<img class="img" id="img${all.dsId}" height="71"  title="<c:if test="${all.sc==0}">关注</c:if><c:if test="${all.sc==1}">取消关注</c:if>" width="71" src="<%=path%>/page/upload/images/123456.jpg"/>
										</c:if>
									</a>
								</div>
								<div class="neirong">${all.users.uName} <br/> <font style="font-size:12px;"><fmt:formatDate value="${all.dsTime}" pattern="yy-MM-dd HH:mm:ss" /></font></div>
							</div>
							${all.dsContent}
						</div>
					</c:if>
					<c:if test="${usid == all.usersUId}">
						<div class="triangle-right-demo demo " id="use" >
							<div class="triangle-right right">
								<div class="tupian"><div class="zan">关注<br/><span id="dianzan${all.dsId}">${all.suport}</span></div>
									<div class="tu">
										<a href="javascript:function()" onclick="dianzan('${all.dsId}')">
											<c:if test="${all.users.image.imLoclhost!=null}">
											<img class="img" id="img${all.dsId}" height="70"  title="<c:if test="${all.sc==0}">关注</c:if><c:if test="${all.sc==1}">取消关注</c:if>" width="70" src="<%=path%>/page/upload/images/${all.users.image.imLoclhost}"/>
											</c:if>
											<c:if test="${all.users.image.imLoclhost==null}">
											<img class="img" id="img${all.dsId}" height="70"  title="<c:if test="${all.sc==0}">关注</c:if><c:if test="${all.sc==1}">取消关注</c:if>" width="70" src="<%=path%>/page/upload/images/123456.jpg"/>
											</c:if>
										</a>
									</div>
									<div class="neirong">${all.users.uName} <br/> <font style="font-size:12px;"><fmt:formatDate value="${all.dsTime}" pattern="yy-MM-dd HH:mm:ss" /></font></div>
								</div>
								${all.dsContent}
							</div>
						</div>
					</c:if>
				</div>
			</c:forEach>
			<div class="editor" id="edit">
			
			</div>
			<div id="submit">
		    	<div id="select">
					<button class="btn btn-primary" id="add">发表</button>
		    	</div>
		    </div><br/>	
	    	<br/>
	    	<br/><br/><br/>
		</div>
	</div>
	<nav id="bt-menu" class="bt-menu">
		<a href="#" class="bt-menu-trigger">Menu</a>
		<ul>
			<li><a href="<%=path%>/fdis/taol.html" >收索</a></li>
			<li><a href="<%=path%>/fdis/fbed.html" >我发布的</a></li>
			<li><a href="<%=path%>/fdis/canyu.html" >我参与的</a></li>
			<li><a href="<%=path%>/fdis/fabu.html" >我要发布</a></li>
			<li><a href="<%=path%>/index/index.html" >返回首页</a></li>
		</ul>
	</nav>
		
	</body>
	<script src="<%=path%>/page/front/disc/js/classie.js"></script>
	<script src="<%=path%>/page/front/disc/js/borderMenu.js"></script>
	<!-- 编辑器 -->
	 <script type="text/javascript" src="<%=path%>/page/front/disc/bianji/src/js/libs/jquery-1.10.2.min.js"></script>
      <script type="text/javascript" src="<%=path%>/page/front/disc/bianji/src/js/jquery.notebook.js"></script>
      <script type="text/javascript">
          $(document).ready(function() {
              $('.editor').notebook({
                  autoFocus: true,
                  placeholder: '我也来说一句'
              });
//           	  var d=document.getElementsByTagName('bold');
//           	  d.style.margin="0";
				
          });
          
      </script>
      <script src="<%=path%>/page/front/disc/bianji/js/ytmenu.js"></script>
      <script type="text/javascript">
			//表单提交采用json提交
			$("button#add").click(function(){
		          var obj={
						"dsContent":$("#edit").html(),
						"udiscusserDrId":$("#drid").val()
					};
					$.post("../adddis.json",obj,function(json){
						if(json == 1){
					        alert("发表成功！");
					        location.reload()
						}else{
					        alert("发表失败！");
						}
					});
 			});
			//表单提交结束
			
			//关注
			function dianzan(dsid){
				var zhan = document.getElementById("dianzan"+dsid);
				$.post("../../them/zan.json?id="+dsid,function(json){
					if(json==0){
						alert("操作失败！");
					}else if(json==1){
						document.getElementById("img"+dsid).title = "关注";
						zhan.innerHTML = zhan.innerHTML*1-1; 
					}else{
						document.getElementById("img"+dsid).title = "取消关注";
						zhan.innerHTML = zhan.innerHTML*1+1; 
					}
				});
			};
		</script>
	
</html>  